<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CFTIME签到系统</title>
<link rel="stylesheet" type="text/css" href="css/layout.css"/>
<script type="text/javascript" src="js/jquery.1.6.4.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.2/external/cookie/jquery.cookie.min.js"></script>
<script type="text/javascript" src="js/calendar-param.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	checkCookie();
});
function checkCookie(){
	var loginstatue = $.cookie('cftime_sign_user');
	if(loginstatue==null||loginstatue==""||loginstatue=="\"\""||loginstatue==undefined){
		$("#userLoginId").css("display","block");
		$("#userInfoId").css("display","none");
	}else{
		$("#userloginedId").val(loginstatue);
		$("#userLoginId").css("display","none");
		$("#userInfoId").css("display","block");
	}
}
function loginUser(){
	var username = $('#username').val();
	var password = $('#password').val();
	var valicode = $('#valicode').val();
	if(username==""||password==""||username.length<5||password.length<5){
		mess('必填数据不能为空！');
		return false;
	}else{
		var url = root+"sign/login-userLogin";
		var param = {"userName":username,"passWord":password};
		$.post(url,param,function(data){
			var jsonObj = eval("("+data+")");
			if(jsonObj.result=="ok"){
				$.cookie('cftime_sign_user','caipeng');
				document.location.href=document.location.href;
			}else{
				mess(jsonObj.result);
				$('#password').val("");
				return false;
			}
		});		
	}
}
function loginOut(){
	$.cookie('cftime_sign_user',null);
	document.location.href=document.location.href;
}
function mess(mess){
	var w = $("#userLoginId").width();
	var h = $("#userLoginId").height();
	var t = $("#userLoginId").position().top;
	var l = $("#userLoginId").position().left;
	$("#messageId").css("display","block");
	$("#messageId").width(w);
	$("#messageId").height(h+5);
	$("#messageTextId").text(mess);
	document.getElementById("messageId").style.top=t;
	document.getElementById("messageId").style.left=l;
	$("#messageId").css("z-index","100");
	$("#messageId").fadeIn(300).fadeOut(50).fadeIn(50).fadeOut(50).fadeIn(50).delay(1000).fadeOut(400);
}
</script>
<style type="text/css">
#userInfoId{ margin:auto; display:none;width:250px; border:1px solid #CCCCCC; padding:5px;}
#userLoginId{margin:auto; width:250px; border:1px solid #CCCCCC; padding:5px;}
ul li{ list-style-type:none; line-height:24px;}
.loginFormInput{ width:120px; height:20px; border:1px solid #CCCCCC;}
.inputerr{ color:red; font-size:10px; padding-left:2px;}
#messageId{ width:30%; height:50px; padding:10px; font-size:25px; background-color:#FFFFFF; color:#FF0000; text-align:center; 
		 top:10%; left:35%; z-index:100; position:absolute; display:none}
.marginlabel{margin-top: 5px;}
</style>
</head>

<body>
<div id="container">
	<div id="header">
	<h1>CFTIME签到系统</h1>
	</div>
	<div id="mainContent">
		<div id="userInfoId">
			<form action="userInfoAction" method="post">
			  <label>当前用户：
				<input name="userlogined" id="userloginedId" type="text" size="12" maxlength="12" class="loginFormInput" readonly="readonly"/>
			  </label>
			  <label>
			  	<input type="button" value="注销" id="userloginOut" onclick="loginOut()" />
			  </label><br />
			  <label class="marginlabel">
				  <a href="index.html">转到日程管理</a>
			  </label>
			</form>
		</div>
		<div id="userLoginId">
			<form action="userLoginAction" method="post">
				<ul>
					<li>
					  <label>登陆邮箱：
					  <input name="username" id="username" type="text" class="loginFormInput" size="12" maxlength="25" />
					  </label><span class="inputerr">*</span>
					</li>
					<li>
					  <label>登陆密码：
					  <input name="password" id="password" type="password" class="loginFormInput" size="12" maxlength="12" />
					  </label><span class="inputerr">*</span>
					</li>
					<li style="display: none;">
					  <label>验证码：
					  <input name="valicode" id="valicode" type="text" class="loginFormInput" size="12" maxlength="12" />
					  </label><span class="inputerr">*</span>
					</li>
					<li>
					  <label>
					  <input type="button" id="btnLogin" value="登录" onclick="loginUser()"/>
					  </label>
					</li>
				</ul>
			</form>
		</div>
	</div>
	<div class="clearfloat"></div>
	<div id="footer">
		Cftime个人签到系统
	</div>
</div>
<!-- 以下是他弹出信息区域 -->
<div id="messageId">
	<span id="messageTextId">操作成功!</span>
</div>
</body>
</html>
